<!DOCTYPE html>
<html lang="zh">

<head>
    <meta charset="UTF-8" />
    <title>index</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
    <meta http-equiv="X-UA-Compatible" content="IE=Edge" />
    <link rel="stylesheet" href="http://127.0.0.1:8000/static/sdk/sdk.css" />
    <link rel="stylesheet" href="http://127.0.0.1:8000/static/sdk/helper.css" />
    <style>
        html,
        body,
        .app-wrapper {
            position: relative;
            width: 100%;
            height: 100%;
            margin: 0;
            padding: 0;
        }
    </style>
</head>

<body>
    <div id="root" class="app-wrapper"></div>
    <script src="http://127.0.0.1:8000/static/sdk/sdk.js"></script>
    <script type="text/javascript">
        (function () {
            let amis = amisRequire('amis/embed');
            let amisJSON = {
                "type": "page",
                "name": "mainpage",
                "title": "仪表盘",
                "initApi": "http://127.0.0.1:8000/",
                "body": [{
                    "type": "form",
                    "title": "添加设备",
                    "visibleOn": "this.id==1",
                    "initApi": "http://127.0.0.1:8000/getdevicekinds/",
                    "api": "http://127.0.0.1:8000/adddevice/",
                    "rules": [{
                        "rule": "data.deviceID.length > 0 && data.devicename.length > 0 && data.kindofdevice.length > 0",
                        "message": "关键信息不能为空"
                    }],
                    "controls": [{
                            "type": "text",
                            "name": "deviceID",
                            "label": "设备序列号"
                        },
                        {
                            "type": "text",
                            "name": "devicename",
                            "label": "设备名"
                        },
                        {
                            "name": "kindofdevice",
                            "type": "radios",
                            "label": "设备种类",
                            "options": [{
                                    "label": "二值控制类",
                                    "value": "1"
                                },
                                {
                                    "label": "信息获取类",
                                    "value": "2"
                                },
                                {
                                    "label": "参数设置类",
                                    "value": "3"
                                },
                            ]
                        }
                    ]
                }, {
                    "type": "crud",
                    "visibleOn": "this.id==2",
                    "api": "http://127.0.0.1:8000/deviceinfo/",
                    "syncLocation": false,
                    "filter": {
                        "title": "条件搜索",
                        "controls": [{
                            "type": "text",
                            "name": "keywords",
                            "placeholder": "通过关键字搜索"
                        }]
                    },
                    "columns": [{
                            "name": "device_id",
                            "label": "设备ID"
                        },
                        {
                            "name": "device_name",
                            "label": "设备名"
                        },
                        {
                            "name": "status",
                            "label": "设备状态"
                        },
                        {
                            "name": "description",
                            "label": "设备信息"
                        },
                        {
                            "type": "operation",
                            "label": "操作",
                            "buttons": [{
                                "label": "操作",
                                "type": "button",
                                "actionType": "drawer",
                                "drawer": {
                                    "title": "查看",
                                    "body": {
                                        "type": "form",
                                        "api": "post:https://3xsw4ap8wah59.cfc-execute.bj.baidubce.com/api/amis-mock/sample/${id}",
                                        "controls": [{
                                                "type": "text",
                                                "name": "engine",
                                                "label": "Engine"
                                            },
                                            {
                                                "type": "text",
                                                "name": "browser",
                                                "label": "Browser"
                                            }
                                        ]
                                    }
                                }
                            }]
                        }
                    ]
                }, {
                    "type": "form",
                    "title": "删除设备",
                    "visibleOn": "this.id==3",
                    "api": "http://127.0.0.1:8000/deldevice/",
                    "controls": [{
                        "type": "text",
                        "name": "deviceID",
                        "label": "设备序列号"
                    }]
                }],
                "aside": [{
                    "type": "wrapper",
                    "size": "xs",
                    "className": "",
                    "body": {
                        "type": "nav",
                        "stacked": true,
                        "links": [{
                                "label": "添加设备",
                                "to": "?id=1"
                            },
                            {
                                "label": "查看设备",
                                "to": "?id=2"
                            },
                            {
                                "label": "移除设备",
                                "to": "?id=3"
                            },
                        ]
                    }
                }, ],
                "toolbar": [{
                    "type": "service",
                    "api": "http://127.0.0.1:8000/userinfo/",
                    "data": {
                        "username": "stranger",
                    },
                    "body": {
                        "type": "tpl",
                        "tpl": "Hello ${username}!"
                    }
                }, {
                    "label": "登出",
                    "type": "button",
                    "actionType": "link",
                    // TODO log out
                    "link": "http://127.0.0.1:8000/index/"
                }],
                "initApi": "https://3xsw4ap8wah59.cfc-execute.bj.baidubce.com/api/amis-mock/mock2/page/initData"
            };
            let amisScoped = amis.embed('#root', amisJSON);
        })();
    </script>
</body>

</html>